@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');
* {
	font-family: Montserrat;
}

/* Page titles */
h1 {
	font-weight: 700 !important;
}

/* Song name in player */
.main-nowPlayingWidget-nowPlaying .main-trackInfo-name {
	overflow: unset;
	font-size: 20px !important;
}

/* Artist name in player */
.main-nowPlayingWidget-nowPlaying .main-trackInfo-artists {
	overflow: unset;
	font-size: 15px;
}

.main-type-finale {
	line-height: 17px;
}

/* Icons */
.main-trackList-rowPlayPauseIcon {
	transform: scale(1.3);
}

.x-downloadButton-button svg {
	height: 32px;
	width: 32px;
}

/* Progress and remaining time */
.main-playbackBarRemainingTime-container,
.playback-bar__progress-time-elapsed,
.playback-bar__progress-time {
	font-size: 15px;
	margin-left: 5px;
	margin-right: 5px;
}

/* Player play button */
.main-playPauseButton-button {
	background-color: unset;
	color: var(--spice-subtext);
}

.main-playPauseButton-button svg {
	height: 28px;
	width: 28px;
}

/* Progress bar */
.progress-bar {
	--fg-color: var(--spice-button);
}

.progress-bar__bg,
.progress-bar__fg,
.progress-bar__fg_wrapper {
	height: 5px;
}

.progress-bar-wrapper {
	margin-left: 5px;
	margin-right: 5px;
}

/* Extra controls */
.control-button::before {
	font-size: 20px;
}

.ExtraControls svg {
	height: 20px;
	width: 20px;
}

/* Removing gradients */
.main-entityHeader-backgroundColor,
.main-actionBarBackground-background {
	background-color: unset !important;
	background-image: none;
}

/* Cover shadow */
.main-entityHeader-shadow {
	-webkit-box-shadow: 0 4px 20px rgba(var(--spice-rgb-shadow), 0.5);
	box-shadow: 0 4px 20px rgba(var(--spice-rgb-shadow), 0.5);
}

/* Top bar */
.main-topBar-background {
	background-color: #3a3d42 !important;
}

/* Playing icon */
.main-trackList-playingIcon {
	filter: saturate(0%);
}

/* Playlist like button */
.main-actionBar-ActionBarRow .main-addButton-button .Svg-ulyrgf-0 {
	height: unset;
	width: unset;
}

/* Order button */
.x-sortBox-sortDropdown {
	margin-top: 3px;
}

/* Sidebar playlists menu */
.main-rootlist-rootlistDividerGradient {
	background: unset;
}

.main-rootlist-rootlistDivider {
	background-color: var(--spice-button);
}

/* Search box */
.x-searchInput-searchInputInput {
	font-size: 18px;
}

/* Aritsts names */
.main-type-mesto {
	font-size: 16px;
	line-height: 20px;
}

/* Songs names */
.main-type-ballad {
	font-size: 18px;
}

/* Cards descriptions */
.main-cardSubHeader-root {
	overflow: hidden !important;
}

/* Ad title */
.desktoproutes-homepage-takeover-ad-hptoNativeOriginal-header {
	font-weight: 700 !important;
}

/* Friends names */
.main-buddyFeed-username a {
	color: var(--spice-text) !important;
	font-size: 17px;
	font-weight: 500;
}

/* Friends songs and artists */
.main-buddyFeed-artistAndTrackName a,
.main-buddyFeed-playbackContextLink span {
	font-size: 13px;
}

/* Cover height */
.main-coverSlotExpanded-container {
	height: var(--nav-bar-width) + 8px;
}

/* Scrollbars */
.os-scrollbar-handle {
	background: var(--spice-button) !important;
	border-radius: 8px;
}

/* Making index column wider so that lighter background that 
highlights selected song contains multi-digit song numbers */
/* It looks good up to 4 digits, I figured that no one has playlists with more music than that ;) */
.main-trackList-trackList.main-trackList-indexable .main-trackList-trackListRowGrid {
	grid-template-columns: [index] 48px [first] 6fr [var1] 4fr [var2] 3fr [last] minmax(120px, 1fr) !important;
}

/* Text boxes in settings */
.main-dropDown-dropDown {
	background-color: var(--spice-button-disabled);
}

/* Facebook button */
.x-settings-facebookButton {
	background-color: unset !important;
}

/* Playlist play button color */
.encore-dark-theme .encore-bright-accent-set,
.encore-dark-theme .encore-bright-accent-set:hover {
	--background-base: var(--spice-button-active);
	--background-highlight: var(--spice-player);
	--background-press: var(--spice-player);	
}

/* Volume bar margins */
.volume-bar .progress-bar {
	margin: 0 0.4rem;
}

.volume-bar .playback-progressbar {
	width: 70%;
}


.volume-bar {
	flex: 0 150px;
}

/* Menu hidden under the button with account name - font size and family unification */
.ellipsis-one-line {
	font-family: Montserrat;
}

.ellipsis-one-line.main-type-mesto {
	font-size: 14px;
}

/* Removal of empty space above playlist cover and title on narrow viewports */
.main-entityHeader-container.main-entityHeader-nonWrapped {
	min-height: 325px;
	height: 15vh;
}
